<template>
  <div>
    <el-row>
      <el-col :span="4">
        <h3>基本信息</h3>
      </el-col>
    </el-row>
    <el-divider></el-divider>
    <el-form ref="form" :model="basicForm" label-width="80px" size="mini">
      <el-row>
        <el-col :span="12">
          <el-form-item label="编号">
            <el-input v-model="basicForm.dustomerSerialNum" placeholder="编号规则：部门+年份+编号，例如IS2022001"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="客户简称">
            <el-input v-model="basicForm.customerReferred"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="客户名称">
            <el-input v-model="basicForm.customerName"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="公司地址">
            <el-input v-model="basicForm.companyAddress"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="邮政编码">
            <el-input v-model="basicForm.postalCode"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="联系人">
            <el-input v-model="basicForm.linkman"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="公司电话">
            <el-input v-model="basicForm.comparyTel"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="传真号">
            <el-input v-model="basicForm.faxNumber"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <el-row>
      <el-col :span="4">
        <h3>甲方负责人</h3>
      </el-col>
      <el-col :span="4" :offset="15">
        <el-button @click="dialogFormVisible=true" size="mini">添加</el-button>
      </el-col>
    </el-row>
    <el-divider></el-divider>
    <el-table :data="partyData" border style="width: 100%">
      <el-table-column prop="serialNumber" label="序号"></el-table-column>
      <el-table-column prop="personName" label="姓名"></el-table-column>
      <el-table-column prop="personJob" label="职务"></el-table-column>
      <el-table-column prop="personDepartment" label="部门"></el-table-column>
      <el-table-column prop="personPhone" label="电话"></el-table-column>
      <el-table-column prop="personEmail" label="Email"></el-table-column>
      <el-table-column prop="personRemark" label="备注"></el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button @click="handleClick(scope.row)" type="text" size="small">查看</el-button>
          <el-button type="text" size="small">编辑</el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-row>
      <el-col :span="4">
        <h3>扩展信息</h3>
      </el-col>
    </el-row>
    <el-divider></el-divider>
    <el-form ref="form" :model="basicForm" label-width="80px" size="mini">
      <el-row>
        <el-col :span="16">
          <el-form-item label="英文名">
            <el-input v-model="basicForm.englishName"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="是否合作">
            <el-input v-model="basicForm.cooperation"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="所在国家">
            <el-input v-model="basicForm.countryId"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="所在省份">
            <el-input v-model="basicForm.provinceId"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="所在城市">
            <el-input v-model="basicForm.cityId"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="客户类型">
            <el-input v-model="basicForm.typeId"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="所属行业">
            <el-input v-model="basicForm.industyId"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="分支机构">
            <el-input v-model="basicForm.embranchment"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="Email">
            <el-input v-model="basicForm.email"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="公司主页">
            <el-input v-model="basicForm.homePage"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="关系建立时间">
            <el-input v-model="basicForm.relationTime"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="8">
          <el-form-item label="关系部门">
            <el-input v-model="basicForm.relationDepartment"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="信用级别">
            <el-input v-model="basicForm.creditRatingsId"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="亲密度">
            <el-input v-model="basicForm.intimacyId"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="16">
          <el-form-item label="开户银行名称">
            <el-input v-model="basicForm.bankName"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="企业代码">
            <el-input v-model="basicForm.enterpriseCode"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="16">
          <el-form-item label="开户银行账号">
            <el-input v-model="basicForm.bankAccount"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="法定代表">
            <el-input v-model="basicForm.member"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-form-item label="纳税人识别号">
        <el-input v-model="basicForm.taxpayerCode"></el-input>
      </el-form-item>
      <el-form-item label="备注">
        <el-input v-model="basicForm.remark"></el-input>
      </el-form-item>
    </el-form>
    <el-row>
      <el-col :span="4">
        <h3>满意度调查</h3>
      </el-col>
      <el-col :span="4" :offset="15">
        <el-button @click="dialogSatisfactions=true" size="mini">添加</el-button>
      </el-col>
    </el-row>
    <el-divider></el-divider>
    <el-table :data="satisfactionsData" border style="width: 100%">
      <el-table-column prop="satisfactionSurveySerialNumber" label="序号"></el-table-column>
      <el-table-column prop="surveyContent" label="调查内容"></el-table-column>
      <el-table-column prop="satisfactionId" label="满意度"></el-table-column>
      <el-table-column prop="surveyTime" label="调查时间"></el-table-column>
      <el-table-column prop="methodId" label="调查方式"></el-table-column>
      <el-table-column prop="mostUnSatisfying" label="备注"></el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button @click="handleClick(scope.row)" type="text" size="small">查看</el-button>
          <el-button type="text" size="small">编辑</el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-row>
      <el-col :span="4">
        <h3>附件</h3>
      </el-col>
      <el-col :span="4" :offset="15">
        <el-upload
          class="upload-demo"
          :action="uploadUrl"
          multiple
          :on-success="handleAvatarSuccess"
          name="fileList"
          :show-file-list="false"
        >
          <el-button size="small" type="primary">点击上传</el-button>
          <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
        </el-upload>
      </el-col>
    </el-row>
    <el-divider></el-divider>
    <el-table :data="appendagesData" border style="width: 100%">
      <el-table-column prop="fileName" label="文件名"></el-table-column>
      <el-table-column prop="uploadTime" label="上传时间"></el-table-column>
      <el-table-column prop="fileSize" label="文件大小"></el-table-column>
      <el-table-column prop="fileType" label="文件类型"></el-table-column>
      <el-table-column label="用户">ABCD</el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button @click="handleClick(scope.row)" type="text" size="small">查看</el-button>
          <el-button type="text" size="small">编辑</el-button>
        </template>
      </el-table-column>
    </el-table>
    <!-- 甲方负责人添加弹框 -->
    <el-dialog title="添加甲方负责人" :visible.sync="dialogFormVisible">
      <el-form :model="chargeform" size="mini">
        <el-row>
          <el-col :span="12">
            <el-form-item label="序号：" :label-width="formLabelWidth">
              <el-input v-model="chargeform.serialNumber"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="姓名：" :label-width="formLabelWidth">
              <el-input v-model="chargeform.personName"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="职务：" :label-width="formLabelWidth">
              <el-input v-model="chargeform.personJob"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="电话：" :label-width="formLabelWidth">
              <el-input v-model="chargeform.personPhone"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="部门：" :label-width="formLabelWidth">
              <el-input v-model="chargeform.personDepartment"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="商务电话：" :label-width="formLabelWidth">
              <el-input v-model="chargeform.personBusinessCal"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="住宅电话：" :label-width="formLabelWidth">
              <el-input v-model="chargeform.personHomePhone"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12"></el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="商务传真：" :label-width="formLabelWidth">
              <el-input v-model="chargeform.personBusinessFax"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="住宅传真" :label-width="formLabelWidth">
              <el-input v-model="chargeform.personResidentialFax"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="Email" :label-width="formLabelWidth">
              <el-input v-model="chargeform.personEmail"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="备注" :label-width="formLabelWidth">
              <el-input type="textarea" v-model="chargeform.personRemark"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogFormVisible = false">取 消</el-button>
        <el-button type="primary" @click="jiafang()">确 定</el-button>
      </div>
    </el-dialog>
    <!-- 满意度调查添加弹框 -->
    <el-dialog title="添加用户满意度" :visible.sync="dialogSatisfactions">
      <el-form :model="surveyform" size="mini">
        <el-form-item label="序号：" :label-width="formLabelWidth">
          <el-input v-model="surveyform.satisfactionSurveySerialNumber"></el-input>
        </el-form-item>
        <el-form-item label="调查内容：" :label-width="formLabelWidth">
          <el-input type="textarea" v-model="surveyform.surveyContent"></el-input>
        </el-form-item>
        <el-form-item label="调查时间：" :label-width="formLabelWidth">
          <!-- <el-input v-model="surveyform.surveyTime"></el-input> -->
          <el-date-picker v-model="surveyform.surveyTime" type="date"></el-date-picker>
        </el-form-item>
        <el-form-item label="满意度：" :label-width="formLabelWidth">
          <el-select v-model="surveyform.satisfactionId">
            <el-option label="满意" value="1"></el-option>
            <el-option label="非常满意" value="2"></el-option>
            <el-option label="不满意" value="3"></el-option>
            <el-option label="非常不满意" value="4"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="调查原因：" :label-width="formLabelWidth">
          <el-input v-model="surveyform.surveyCause"></el-input>
        </el-form-item>
        <el-form-item label="调查方式：" :label-width="formLabelWidth">
          <el-select v-model="surveyform.methodId">
            <el-option label="问卷调查" value="1"></el-option>
            <el-option label="统计调查" value="2"></el-option>
            <el-option label="询问调查" value="3"></el-option>
            <el-option label="电话调查" value="4"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="最满意方面：" :label-width="formLabelWidth">
          <el-input v-model="surveyform.mostSatisfying"></el-input>
        </el-form-item>
        <el-form-item label="最不满意方面：" :label-width="formLabelWidth">
          <el-input v-model="surveyform.remark"></el-input>
        </el-form-item>
        <el-form-item label="备注：" :label-width="formLabelWidth">
          <el-input type="textarea" v-model="surveyform.mostUnSatisfying"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogSatisfactions = false">取 消</el-button>
        <el-button type="primary" @click="manyifan()">确 定</el-button>
      </div>
    </el-dialog>
    <el-button @click="tianjia">保存</el-button>
    <el-button>返回</el-button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      uploadUrl:
        "http://localhost:20932/api/FileManager/FileManager/FilesUpload",
      basicForm: {
        dustomerSerialNum: "",
        customerReferred: "",
        customerName: "",
        companyAddress: "",
        postalCode: "",
        linkman: "",
        comparyTel: "",
        faxNumber: "",
        englishName: "",
        cooperation: 0,
        countryId: 0,
        provinceId: 0,
        cityId: 0,
        typeId: 0,
        industyId: 0,
        embranchment: 0,
        email: "",
        homePage: "",
        relationTime: "",
        relationDepartment: "",
        creditRatingsId: 0,
        intimacyId: 0,
        bankName: "",
        enterpriseCode: "",
        bankAccount: "",
        member: "",
        taxpayerCode: "",
        remark: "",
        jiafuId:"",

      },
      partyData: [],

      satisfactionsData: [],
      appendagesData: [],
      dialogFormVisible: false,
      dialogSatisfactions: false,
      chargeform: {
        serialNumber: "",
        personName: "",
        personJob: "",
        personPhone: "",
        personDepartment: "",
        personBusinessCal: "",
        personHomePhone: "",
        personEmail: "",
        personRemark: ""
      },
      surveyform: {
        satisfactionSurveySerialNumber: "",
        surveyContent: "",
        surveyTime: "",
        satisfactionId: "",
        surveyCause: "",
        methodId: "",
        mostSatisfying: "",
        remark: "",
        mostUnSatisfying: ""
      },
      wenjianji:{
        fileName:"",
        uploadTime:"",
        fileSize:"",
        fileType:"",
        dustomerSerialNum:"",
      },
      formLabelWidth: "120px"
    };
  },
  created() {
    //  this.loginUserName = this.$cookieTools.getLoginUser().user_name;
    this.loginUserName = "ABCD";
  },
  methods: {
    onSubmit() {
      console.log("submit!");
    },
    handleClick(row) {
      console.log(row);
    },
    handleAvatarSuccess(res, file, fileList) {
      if (res.code == 1) {
        res.data.some((f, i) => {
          this.appendagesData.push({
            fileName: f.fileOldName,
            uploadTime: f.upLoadDate,
            fileSize: f.fileSize,
            fileType: f.fileType
          });
          this.wenjianji.fileName=f.fileOldName;
          this.wenjianji.uploadTime=f.upLoadDate;
          this.wenjianji.fileSize=f.fileSize;
          this.wenjianji.fileType=f.fileType;
          
        });
      }
    },
    //甲方负责人反填信息
    jiafang(){
        console.log(this.chargeform)
        this.partyData.push({
          serialNumber:this.chargeform.serialNumber,
          personName:this.chargeform.personName,
          personJob:this.chargeform.personJob,
          personDepartment:this.chargeform.personDepartment,
          personPhone:this.chargeform.personPhone,
          personEmail:this.chargeform.personEmail,
          personRemark:this.chargeform.personRemark,
        })
        // this.partyData.serialNumber=this.chargeform.serialNumber;
        // this.partyData.personName=this.chargeform.personName;
        // this.partyData.personJob=this.chargeform.personJob;
        // this.partyData.personDepartment=this.chargeform.personDepartment;
        // this.partyData.personPhone=this.chargeform.personPhone;
        // this.partyData.personEmail=this.chargeform.personEmail;
        // this.partyData.personRemark=this.chargeform.personRemark;

        this.dialogFormVisible=false;
        
    },
    //满意度反填信息
    manyifan(){
      this.satisfactionsData.push({
        satisfactionSurveySerialNumber:this.surveyform.satisfactionSurveySerialNumber,
        surveyContent:this.surveyform.surveyContent,
        satisfactionId:this.surveyform.satisfactionId,
        surveyTime:this.surveyform.surveyTime,
        methodId:this.surveyform.methodId,
        mostUnSatisfying:this.surveyform.mostUnSatisfying,
      })
      this.dialogSatisfactions=false;
    },
    tianjia(){
      // 甲方负责人
      this.$myaxios.post("CustomerInput/ResponsiblePersonPoAdd",this.chargeform).then((r)=>{
        if(r.data==false)
        {
          return;
          this.$message('添加失败');
        }
      })
      // 基本信息添加
      this.basicForm.jiafuId=this.chargeform.serialNumber;
      console.log(this.basicForm)
      this.$myaxios.post("CustomerInput/CustomerPoAdd",this.basicForm).then((r)=>{
        if(r.data==false)
        {
          return;
          this.$message('添加失败');
        }
      })
      
      // 满意度
      this.$myaxios.post("CustomerInput/SatisfactionSurveyPoAdd",this.surveyform).then((r)=>{
        if(r.data==false)
        {
          return;
          this.$message('添加失败');
        }
      })
      // 文件
      this.wenjianji.dustomerSerialNum=this.basicForm.dustomerSerialNum;
      console.log(this.wenjianji)
      this.$myaxios.post("CustomerInput/AccessoryPoAdd",this.wenjianji).then((r)=>{
        if(r.data)
        {
          this.$message('添加成功');
        }
        else
        {
          this.$message('添加失败');
        }
      })
    }
  }
};
</script>